<!-- head - 开始 -->
<? require(dirname(dirname(__FILE__)).'/public/head.html'); ?>
<!-- head - 结束 -->

</head>
<? require(dirname(dirname(__FILE__)).'/public/body.html'); ?>
    <div class="wrapper" id="options">
        
        <!-- 侧边栏 - 开始 -->
        <i-left-side></i-left-side>
        <!-- 侧边栏 - 结束 -->
        
        <div class="content-page">
            
            <div class="content">
                
                <!-- 顶部导航 - 开始 -->
                <i-top-nav></i-top-nav>
                <!-- 顶部导航 - 结束 -->
                
                <!-- 内容 - 开始 -->
                <div class="container-fluid">
                
                    <!-- 页面标题 开始 -->
                    <div class="row">
                        <div class="col-12">
                            <div class="page-title-box">
                                <div class="page-title-right">
                                    <form class="form-inline">
                                        <div class="form-group">
                                            <div class="input-group">
                                                <input type="text" class="form-control form-control-light" id="dash-daterange">
                                                <div class="input-group-append">
                                                    <span class="input-group-text bg-primary border-primary text-white">
                                                        <i class="mdi mdi-calendar-range font-13"></i>
                                                    </span>
                                                </div>
                                            </div>
                                        </div>
                                        <a href="/index/options" class="btn btn-primary ml-2">
                                            <i class="mdi mdi-autorenew"></i>
                                        </a>
                                    </form>
                                </div>
                                <h4 class="page-title">站点设置</h4>
                            </div>
                        </div>
                    </div>
                    <!-- 页面标题 结束 -->
                
                    <div class="row">
                        <div class="col-sm-12">
                            <div class="card bg-primary">
                                <div class="card-body profile-user-box">
                
                                    <div class="row">
                                        <div class="col-sm-8">
                                            <div class="media">
                                                <span class="float-left m-2 mr-4">
                                                    <input v-show="false" v-on:change="upload($event)" type="file" id="btn_file" />
                                                    <img v-on:click="clickUpload()" :src="options.site_img" style="height: 100px;" class="rounded-circle img-thumbnail pointer">
                                                </span>
                                                <div class="media-body">
                
                                                    <h4 class="mt-1 mb-1 text-white">{{options.title}}</h4>
                                                    <p class="font-13 text-white-50">{{options.description}}</p>
                
                                                    <ul v-if="false" class="mb-0 list-inline text-light">
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">5482</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的文章</p>
                                                        </li>
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">25,184</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的评论</p>
                                                        </li>
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">25,184</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的访客</p>
                                                        </li>
                                                        <li class="list-inline-item mr-3">
                                                            <h5 class="mb-1">2184</h5>
                                                            <p class="mb-0 font-13 text-white-50">我的访客</p>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                
                                        <div class="col-sm-4">
                                            <div class="text-center mt-sm-0 mt-3 text-sm-right">
                                                <a :href="options.site_url" class="btn btn-light" target="_blank">
                                                    <i class="mdi mdi-account-edit mr-1"></i>前台网站
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                
                                </div>
                            </div>
                        </div>
                    </div>
                
                    <div class="row">
                
                        <div class="col-12">
                            <div class="card">
                                <div class="card-body">
                
                                    <div class="conf-switch mr-3">
                                        <a href="javascript:;" class="mr-2" data-toggle="modal" data-target="#fill-token-modal">Token验证</a>
                                        <input type="checkbox" id="token" v-model="token_switch" v-on:click="btnSaveToken()" data-switch="primary"/>
                                        <label for="token" data-on-label="On" data-off-label="Off"></label>
                                    </div>
                
                                    <div class="conf-switch mr-3">
                                        <a href="javascript:;" class="mr-2" data-toggle="modal" data-target="#fill-domain-modal">白名单</a>
                                        <input type="checkbox" id="domain" v-model="domain_switch" v-on:click="btnSaveDomain()" data-switch="primary"/>
                                        <label for="domain" data-on-label="On" data-off-label="Off"></label>
                                    </div>
                
                                    <div class="conf-switch mr-3">
                                        <a href="javascript:;" class="mr-2" data-toggle="modal" data-target="#fill-master-modal">站长信息</a>
                                    </div>
                
                                    <!-- Token 验证说明 - 开始 -->
                                    <div id="fill-token-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="fill-primary-modalLabel" aria-hidden="true">
                                        <div class="modal-dialog">
                                            <div class="modal-content modal-filled bg-primary">
                                                <div class="modal-header">
                                                    <h4 class="modal-title" id="fill-token-modalLabel">什么是 Token 验证？</h4>
                                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                                                </div>
                                                <div class="modal-body">
                                                    <p>Token 是服务端生成的一串字符串，以作客户端进行请求的一个令牌。</p>
                                                    <p>开启 Token 验证后，客户端获取数据需要提交 Token，在一定的程度上可以防止API被恶意请求。</p>
                                                    <p>
                                                        <span class="mr-2">您当前的 Token ：{{token.value}}<span v-if="!token.value">（Token验证未开启）</span></span>
                                                        <button v-if="token.value" v-on:click="resetToken()" type="button" class="btn btn-icon btn-sm btn-rounded btn-warning">
                                                            <svg t="1609214279542" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4993" width="20" height="20"><path d="M661.679 715.532c-45.365 31.847-98.578 47.706-152.838 47.066-7.203-0.119-14.282-0.649-21.365-1.171-2.868-0.293-5.739-0.769-8.607-1.171-5.62-0.704-11.062-1.408-16.504-2.524-3.338-0.585-6.677-1.518-9.896-2.277-5.323-1.171-10.591-2.341-15.805-3.869-2.456-0.933-4.797-1.691-7.258-2.688-6.027-1.875-12-3.979-17.734-6.384-1.29-0.586-2.575-1.052-3.864-1.573-6.731-3.11-13.404-6.266-19.902-9.659-0.233-0.183-0.585-0.292-0.818-0.475-21.892-12.056-41.853-26.863-59.414-44.543-0.292-0.292-0.526-0.64-0.878-0.933-5.447-5.451-10.655-11.067-15.572-17.158-0.997-1.226-1.989-2.451-3.045-3.915-35.647-44.605-57.13-101.093-57.13-162.499h68.723L209.896 336.981 100.025 501.759h68.604c0 72.17 22.596 139.139 60.82 194.575 0.469 0.814 0.761 1.692 1.287 2.396 3.922 5.734 8.371 10.948 12.585 16.216 1.64 1.93 3.043 3.924 4.742 6.092 6.204 7.49 12.938 14.634 19.724 21.658 0.704 0.695 1.29 1.28 1.875 1.93 23.002 23.058 48.937 42.375 77.208 57.95 0.764 0.412 1.404 0.76 2.282 1.226 8.14 4.391 16.509 8.434 24.937 12.119 2.168 0.933 4.217 1.875 6.265 2.753 7.317 3.101 14.749 5.68 22.244 8.25a544.847 544.847 0 0 0 10.651 3.576 360.468 360.468 0 0 0 20.021 5.085c4.509 1.062 8.84 2.232 13.463 3.046 1.875 0.467 3.631 1.052 5.501 1.235 6.439 1.17 12.818 1.756 19.143 2.515 2.341 0.412 4.624 0.814 6.905 1.052 11.474 1.116 22.889 1.812 34.303 1.812 69.717 0 137.852-21.302 196.269-62.277 18.617-13.052 23.181-38.807 10.188-57.31-13.113-18.788-38.75-23.297-57.363-10.126m193.516-213.773c0-71.999-22.299-138.908-60.347-194.046-0.586-0.938-0.938-1.935-1.409-2.753-4.916-6.791-9.951-13.111-15.16-19.491a24.31 24.31 0 0 1-1.696-2.341c-35.003-42.146-78.73-74.869-128.193-96.234-1.464-0.585-2.693-1.228-4.157-1.813-7.962-3.279-16.038-6.089-24.292-8.899-2.808-0.936-5.794-1.989-8.721-2.868-7.144-2.165-14.282-3.921-21.54-5.62-4.042-0.878-8.14-1.93-12.178-2.751-1.989-0.35-3.805-0.935-5.913-1.347-5.442-0.878-10.77-1.404-16.212-2.049-3.805-0.409-7.436-0.995-11.24-1.404-9.133-0.878-18.206-1.23-27.279-1.404-1.637 0-3.274-0.236-4.916-0.236-0.292 0-0.585 0.06-0.878 0.117-69.658 0.06-137.674 21.073-195.976 61.991-18.617 12.995-23.181 38.691-10.07 57.422 12.938 18.558 38.752 23.122 57.425 10.011 45.013-31.49 97.581-47.533 151.489-47.002 7.729 0.055 15.457 0.407 22.948 1.171 2.341 0.173 4.563 0.526 6.905 0.878 6.206 0.759 12.352 1.578 18.438 2.867 2.635 0.466 5.328 1.171 7.848 1.756 6.027 1.344 11.881 2.748 17.675 4.504 1.935 0.53 3.69 1.17 5.447 1.875 6.731 2.167 13.284 4.45 19.609 7.143 0.699 0.174 1.345 0.7 1.989 0.933 38.455 16.509 72.113 41.913 98.454 73.755 0.06 0.119 0.179 0.352 0.412 0.531 36.996 45.072 59.24 102.611 59.295 165.304h-68.779L814.22 666.6l109.755-164.84h-68.78z" fill="#ffffff" p-id="4994" data-spm-anchor-id="a313x.7781069.0.i0" class="selected"></path></svg>
                                                        </button>
                                                    </p>
                                                    <div class="conf-switch mr-3">
                                                        <span class="mr-2">允许通过API方式获取Token：</span>
                                                        <input type="checkbox" id="token_is_open" v-model="token_open_switch" v-on:click="btnSaveTokenOpen()" data-switch="warning"/>
                                                        <label for="token_is_open" data-on-label="Yes" data-off-label="No"></label>
                                                    </div>
                                                </div>
                                                <div class="modal-footer">
                                                    <button type="button" class="btn btn-outline-light" data-dismiss="modal">我已了解</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- Token 验证说明 - 结束 -->
                                    
                                    <!-- 域名白名单 - 结束 -->
                                    <div id="fill-domain-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="fill-primary-modalLabel" aria-hidden="true">
                                        <div class="modal-dialog">
                                            <div class="modal-content modal-filled bg-primary">
                                                <div class="modal-header">
                                                    <h4 class="modal-title" id="fill-primary-modalLabel">什么是白名单？</h4>
                                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                                                </div>
                                                <div class="modal-body">
                                                    <p>白名单是后端针对前端发起的API请求做的域名限制。</p>
                                                    <p>开启后，只有名单内的域名可以发起API请求，在一定的程度上可以防止API被恶意请求。</p>
                                                    <div class="row">
                                                        <textarea class="form-control domain-textarea border-radius-unset" rows="5" v-model="domain.value" placeholder="非必填，留空或填写*表示不限制&#13;&#10;域名白名单(每行1个)&#13;&#10;如：inis.cc"></textarea>
                                                    </div>
                                                </div>
                                                <div class="modal-footer">
                                                    <button type="button" class="btn btn-outline-light" data-dismiss="modal">我已了解</button>
                                                    <button type="button" class="btn btn-light" v-on:click="btnSaveDomainValue()" data-dismiss="modal">保存配置</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- 域名白名单 - 结束 -->
                                    
                                    <!-- 站长信息 - 结束 -->
                                    <div id="fill-master-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="fill-primary-modalLabel" aria-hidden="true">
                                        <div class="modal-dialog modal-lg modal-dialog-centered">
                                            <div class="modal-content modal-filled bg-primary">
                                                <div class="modal-header">
                                                    <h4 class="modal-title" id="fill-primary-modalLabel">站长信息</h4>
                                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                                                </div>
                                                <div class="modal-body">
                                                    <div class="row">
                                                        <div class="col-lg-6">
                                                            <div class="form-group row mb-3">
                                                                <label class="col-3 col-form-label">站长帐号</label>
                                                                <div class="col-9">
                                                                    <select id="web-master" class="form-control select2" data-toggle="select2"></select>
                                                                </div>
                                                            </div>
                                                            <div class="form-group row mb-3">
                                                                <label class="col-3 col-form-label">QQ</label>
                                                                <div class="col-9">
                                                                    <input v-model="master.qq" type="text" class="form-control" placeholder="QQ">
                                                                </div>
                                                            </div>
                                                            <div class="form-group row mb-3">
                                                                <label class="col-3 col-form-label">GitHub</label>
                                                                <div class="col-9">
                                                                    <input v-model="master.github" type="text" class="form-control" placeholder="GitHub">
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-lg-6">
                                                            <div class="form-group row mb-3">
                                                                <label class="col-3 col-form-label">微博</label>
                                                                <div class="col-9">
                                                                    <input v-model="master.weibo" type="text" class="form-control" placeholder="weibo">
                                                                </div>
                                                            </div>
                                                            <div class="form-group row mb-3">
                                                                <label class="col-3 col-form-label">微信</label>
                                                                <div class="col-9">
                                                                    <input v-model="master.wechat" type="text" class="form-control" placeholder="WeChat">
                                                                </div>
                                                            </div>
                                                            <div class="form-group row mb-3">
                                                                <label class="col-3 col-form-label">Gitee</label>
                                                                <div class="col-9">
                                                                    <input v-model="master.gitee" type="text" class="form-control" placeholder="Gitee">
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-lg-12">
                                                            <label class="col-3 col-form-label pl-0">关于我的介绍</label>
                                                            <textarea v-model="master.description" class="form-control domain-textarea border-radius-unset" rows="5" placeholder="介绍一下自己的兴趣爱好等~（支持HTML格式代码）"></textarea>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="modal-footer">
                                                    <button type="button" class="btn btn-outline-light" data-dismiss="modal">我已了解</button>
                                                    <button v-on:click="saveMaster()" type="button" class="btn btn-light">保存配置</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- 站长信息 - 结束 -->
                                    
                                </div>
                            </div>
                        </div>
                
                        <div class="col-xl-6">
                            <div class="card">
                                <div class="card-body">
                                    <h4 class="header-title mb-3">站点信息</h4>
                                    <div class="tab-content mb-0 b-0">
                                        <div class="tab-pane fade active show">
                                            <div class="row">
                                                <div class="col-12">
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">站点名称</label>
                                                        <div class="col-md-9">
                                                            <input type="text" class="form-control" placeholder="站点的名称将显示在网页的标题处" v-model="options.title">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">站点描述</label>
                                                        <div class="col-md-9">
                                                            <input type="text" class="form-control" placeholder="站点描述将显示在网页代码的头部" v-model="options.description">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">关键词</label>
                                                        <div class="col-md-9">
                                                            <input type="text" class="form-control" placeholder="请以英文 , 分割多个关键字" v-model="options.keywords">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">备案信息</label>
                                                        <div class="col-md-9">
                                                            <input type="text" class="form-control" placeholder="支持HTML代码" v-model="options.copy">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                
                        <div class="col-xl-6">
                            <div class="card">
                                <div class="card-body">
                                    <h4 class="header-title mb-3">站点展示</h4>
                                    <div class="tab-content mb-0 b-0">
                                        <div class="tab-pane fade active show">
                                            <div class="row">
                                                <div class="col-12">
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">站点头像</label>
                                                        <div class="col-md-9">
                                                            <input type="text" class="form-control" placeholder="用于前台头像显示" v-model="options.site_img">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">前台地址</label>
                                                        <div class="col-md-9">
                                                            <input type="text" class="form-control" placeholder="前台地址，用于后台跳转到前台" v-model="options.site_url">
                                                        </div>
                                                    </div>
                                                    <div class="form-group row mb-3">
                                                        <label class="col-md-3 col-form-label">favicon地址</label>
                                                        <div class="col-md-9">
                                                            <input type="text" class="form-control" placeholder="页面Title图标" v-model="options.site_ico">
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                
                    <!-- 保存 -->
                    <div class="inis-save">
                        <button type="button" class="btn btn-icon btn-primary" v-on:click="btnSave()">
                            <svg t="1603529849300" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4317" width="20" height="20">
                                <path d="M0 1024V0h160v320h512V0h96l256 256v768H0z m864-512H160v320h704V512z" fill="#fafbfe" p-id="4318" data-spm-anchor-id="a313x.7781069.0.i11" class="selected"></path>
                                <path d="M416 0h160v256h-160z" fill="#fafbfe" p-id="4319" data-spm-anchor-id="a313x.7781069.0.i12" class="selected"></path>
                            </svg>
                        </button>
                    </div>
                
                </div>
                <!-- 内容 - 结束 -->
                
            </div>
            
            <!-- 页脚 - 开始 -->
            <i-footer></i-footer>
            <!-- 页脚 - 结束 -->
        </div>
        
        <!-- 右侧边栏 - 开始 -->
        <i-right-side></i-right-side>
        <!-- 右侧边栏 - 结束 -->
    </div>
    
    <script src="<?= __ADMIN_JS__.'vue/options.js?v='.__VERSION__; ?>"></script>
    
    <!-- 依赖 - 开始 -->
    <? require(dirname(dirname(__FILE__)).'/public/script.html'); ?>
    <!-- 依赖 - 结束 -->
    
    <!-- APP JS - 开始 -->
    <!-- APP JS - 结束 -->
    
    <!-- footer - 开始 -->
    <? require(dirname(dirname(__FILE__)).'/public/footer.html'); ?>
    <!-- footer - 结束 -->